<template>
  <zl-autocomplete v-model="value" :url="fetchData" :params="params" placeholder="请输入内容" />
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { ZlAutocomplete } from '@zl-crud/components'
import '@zl-crud/components/autocomplete/style/index'

const value = ref('')

// 示例数据获取函数
const fetchData = (params) => {
  // 实际使用中这里应该是调用后端接口
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve({
        data: [
          { id: 1, label: '选项1', desc: '描述1' },
          { id: 2, label: '选项2', desc: '描述2' },
          { id: 3, label: '选项3', desc: '描述3' },
        ],
      })
    }, 300)
  })
}

const params = { type: 'user' }
</script>
